<extend name="common" />
<block name="main">
<div class="createpro-main">
    <div class="createpro-bd clear">
        <form id="createproForm" method="post" class="form-horizontal" data-validate="false" action="editUserinfo">
          <div class="form-group">
              <label class="col-lg-2 control-label">用户名</label>
              <div class="col-lg-5">
                  <input type="text" class="form-control" autocomplete="off" value="{$user.username}" readonly>
              </div>
          </div>
          <div class="form-group">
              <label class="col-lg-2 control-label">头像</label>
              <div class="col-lg-5">
                <a href="javascript:;" class="replace-head" title="点击更改头像"><img src="__ROOT__/{$user.headurl|default='public/images/default_head.png'}" id="user_headimg" width="100" height="100" class="img-thumbnail"></a>
                <input type="file" id="select_img" name="select_img" class="hide"/>
                <input type="hidden" id="headurl" name="headurl" value="{$user.headurl}">
              </div>
          </div>
          <div class="form-group">
              <label class="col-lg-2 control-label">昵称</label>
              <div class="col-lg-5">
                  <input type="text" class="form-control" id="nickname" name="nickname" placeholder="请输入昵称" autocomplete="off" data-bv-stringlength-max="12" data-bv-stringlength-message="昵称长度必须小于12" value="{$user.nickname}">
              </div>
          </div>
          <div class="form-group">
              <label class="col-lg-2 control-label">性别</label>
              <div class="col-lg-5">
                <div class="radio">
                  <label>
                    <if condition="$user['sex'] eq 0">
                    <input type="radio" name="sex" value="0" checked/> 男
                    <else />
                    <input type="radio" name="sex" value="0"/> 男
                    </if>
                  </label>
                  <label>
                    <if condition="$user['sex'] eq 1">
                      <input type="radio" name="sex" value="1" checked/> 女
                    <else />
                      <input type="radio" name="sex" value="1"/> 女
                    </if>
                  </label>
                  <label>
                    <if condition="$user['sex'] eq 2">
                    <input type="radio" name="sex" value="2" checked/> 保密
                    <else />
                    <input type="radio" name="sex" value="2" /> 保密
                    </if>
                  </label>
                  </div>
              </div>
          </div>
          <div class="form-group">
              <label class="col-lg-2 control-label">手机号</label>
              <div class="col-lg-5">
                  <input type="mobile" class="form-control" id="mobile" name="mobile" placeholder="请输入手机号" autocomplete="off" value="{$user.mobile}">
              </div>
          </div>
          <div class="form-group">
              <label class="col-lg-2 control-label">邮箱</label>
              <div class="col-lg-5">
                  <input type="email" data-bv-message="请输入正确的邮箱" class="form-control" id="email" name="email" placeholder="请输入邮箱" autocomplete="off" value="{$user.email}">
              </div>
          </div>
          <div class="form-group">
              <label class="col-lg-2 control-label">qq</label>
              <div class="col-lg-5">
                  <input type="text" class="form-control" id="qq" name="qq" placeholder="请输入qq" autocomplete="off" value="{$user.qq}">
              </div>
          </div>

          <div class="form-group">
              <div class="col-lg-5 col-lg-offset-2">
                  <button type="submit" class="btn btn-primary btn-submit col-lg-12">保存</button>
              </div>
          </div>
      </form>
  </div>
</div>
<script>
$(function(){
  $('.replace-head').click(function(){
    $('#select_img').trigger('click');
  })

  $('#select_img').change(function(){
    $.ajaxFileUpload({
      url: '{:U("Home/Base/uploadImg")}', //用于文件上传的服务器端请求地址
      secureuri: false, //是否需要安全协议，一般设置为false
      fileElementId: 'select_img', //文件上传域的ID
      dataType: 'json', //返回值类型 一般设置为json
      success: function (rs)  //服务器成功响应处理函数
      {
          $('#headurl').val(rs.imgurl);
          $('#user_headimg').attr('src',"__ROOT__"+'/'+rs.imgurl);
      },
      error: function (e)//服务器响应失败处理函数
      {
          alert(e.msg);
      }})
  })

  $('form').bootstrapValidator({
    message: 'This value is not valid',
            feedbackIcons: {/*输入框不同状态，显示图片的样式*/
                valid: 'glyphicon glyphicon-ok',
                invalid: 'glyphicon glyphicon-remove',
                validating: 'glyphicon glyphicon-refresh'
            },
            fields: {/*验证*/
                nickname: {/*键名username和input name值对应*/
                    message: '无效的昵称',
                    validators: {
                        stringLength: {/*长度提示*/
                            max: 12,
                            message: '用户名长度必须在6到30之间'
                        }/*最后一个没有逗号*/
                    }
                },
                email: {
                  validators: {
                     emailAddress: {
                         message: '请输入正确的邮件地址如：123@qq.com'
                     }
                 }
                },
                mobile: {
                   message: '无效的手机号',
                   validators: {
                       stringLength: {
                           min: 11,
                           max: 11,
                           message: '请输入11位手机号码'
                       },
                       regexp: {
                           regexp: /^1[0-9]{1}[0-9]{9}$/,
                           message: '请输入正确的手机号码'
                       }
                   }
                },
            }
  });
})
</script>
</block>